/*cI4u54VYZVPxnvGrX5EL6HXX6+tBhMNbry4zRW5Uf2RuXYfnoeOdBS4xA3fBBRYR*/
/**
 * 新增资产审批单 卡片态
 * @author cuixuh
 */
import React, { Component } from 'react';
import { createPage, base, high } from 'nc-lightapp-front';
import {
	buttonClick,
	initTemplate,
	headAfterEvent,
	headBeforeEvent,
	bodyAfterEvent,
	pageInfoClick,
	backToList,
	modelSave,
	rowSelected,
	beforeEvent,
	commitAction
} from './events';
import { pageConfig } from './const';
import ampub from 'ampub';
const { components, commonConst, utils } = ampub;
const { StatusUtils } = commonConst;
const { multiLangUtils, closeBrowserUtils, cardUtils, listUtils } = utils;
const { getTitleName } = listUtils;
const { getMultiLangByID } = multiLangUtils;
const { createCardTitleArea, createCardPaginationArea, getCommonTableHeadLeft, creatCardSocket } = cardUtils;
const { ApprovalTrans } = components;
const { UISTATE } = StatusUtils;
const { NCAffix, NCDiv } = base;
const { Inspection, ApproveDetail } = high;
const { title, formId, tableId, pagecode, dataSource, alarmId, alarmTitle, btn_area } = pageConfig;
import '../index.less';

class Card extends Component {
	constructor(props) {
		super(props);
		this.is_allow_dept_midlev = false; //是否允许部门非末级(组织级数据)
		this.state = {
			show: false,
			sourceData: null,
			transi_type: '',
			pk_newasset: '',
			compositedisplay: false,
			compositedata: {}
		};
		closeBrowserUtils.call(this, props, { form: [ formId ], cardTable: [ tableId ] });
		initTemplate.call(this, props);
	}

	componentDidMount() {}

	//提交及指派 回调
	getAssginUsedr = (value) => {
		commitAction.call(this, this.props, 'SAVE', 'commit', value);
	};
	//取消 指派
	turnOff = () => {
		this.setState({
			compositedisplay: false
		});
	};

	//获取列表肩部信息
	getTableHeadLeft = () => {
		return getCommonTableHeadLeft.call(this, this.props);
	};

	//获取列表肩部信息
	getTableHead = () => {
		let { createButtonApp } = this.props.button;
		return (
			<div className="shoulder-definition-area">
				<div className="definition-icons">
					{createButtonApp({
						area: 'card_body',
						buttonLimit: 3,
						onButtonClick: buttonClick.bind(this),
						popContainer: document.querySelector('.header-button-area')
					})}
				</div>
			</div>
		);
	};

	render() {
		let { cardTable, form, button, ncmodal, cardPagination, ncUploader, modal } = this.props;
		let { createForm } = form;
		let { createCardTable } = cardTable;
		let { createButtonApp, createErrorFlag } = button;
		let { createNCUploader } = ncUploader;
		let { createModal } = ncmodal;
		let status = form.getFormStatus(formId) || UISTATE.browse;
		return (
			<div className="nc-bill-card">
				<div className="nc-bill-top-area">
					<NCAffix>
						<NCDiv areaCode={NCDiv.config.HEADER} className="nc-bill-header-area">
							{/* 标题 title */}
							<div className="header-title-search-area">
								{createCardTitleArea.call(this, this.props, {
									title: getTitleName.call(this, this.props) /* 国际化处理： 新增资产审批单*/,
									formId,
									backBtnClick: backToList
								})}
							</div>

							{/* 按钮区 btn-area */}
							<div className="header-button-area">
								{/* 创建重试、回退等 saga 控制按钮 */}
								{createErrorFlag({
									headBtnAreaCode: btn_area.CARD_HEAD,
								})}
								{createButtonApp({
									area: btn_area.CARD_HEAD,
									buttonLimit: 3,
									onButtonClick: buttonClick.bind(this),
									popContainer: document.querySelector('.header-button-area')
								})}
							</div>
							{/*浏览态增加 上一页/下一页 */}
							{createCardPaginationArea.call(this, this.props, {
								formId,
								dataSource,
								pageInfoClick
							})}
						</NCDiv>
					</NCAffix>
					<div className="nc-bill-form-area">
						{createForm(formId, {
							onAfterEvent: headAfterEvent.bind(this),
							onBeforeEvent: headBeforeEvent.bind(this)
						})}
					</div>
				</div>
				<div className="nc-bill-bottom-area">
					<div className="nc-bill-table-area">
						{createCardTable(tableId, {
							tableHeadLeft: this.getTableHeadLeft.bind(this),
							tableHead: this.getTableHead.bind(this),
							modelSave: modelSave.bind(this),
							showCheck: true,
							showIndex: true,
							adaptionHeight: true,
							selectedChange: rowSelected.bind(this),
							onBeforeEvent: beforeEvent.bind(this),
							onAfterEvent: bodyAfterEvent.bind(this)
						})}
					</div>
				</div>
				{/* 提示框 */}
				{createModal('confirm', { color: 'warning' })}
				{/* 预警提示框 */}
				{modal.createModal(alarmId, {
					title: getMultiLangByID(alarmTitle) /* 国际化处理： 预警提示*/
				})}
				{/* 联查预算 */}
				<Inspection
					show={this.state.show}
					sourceData={this.state.sourceData}
					cancel={() => {
						this.setState({ show: false });
					}}
					affirm={() => {
						this.setState({ show: false });
					}}
				/>
				{/*审批详情*/}
				<ApproveDetail
					show={this.state.showApprove}
					close={() => {
						this.setState({ showApprove: false });
					}}
					billtype={this.state.transi_type}
					billid={this.state.pk_newasset}
				/>
				{/*附件*/}
				{createNCUploader(`${pagecode}-uploader`, {})}
				{/* 提交及指派 */}
				{this.state.compositedisplay ? (
					<ApprovalTrans
						title={getMultiLangByID('amcommon-000002')} /* 国际化处理： 指派*/
						data={this.state.compositedata}
						display={this.state.compositedisplay}
						getResult={this.getAssginUsedr}
						cancel={this.turnOff}
					/>
				) : (
					''
				)}
				{/* 创建 socket 链接 */}
				{creatCardSocket.call(this, this.props, {
					headBtnAreaCode: btn_area.CARD_HEAD, // 按钮区域编码,用于平台内部更新按钮状态
					formAreaCode: formId, //表单区域编码, 用于平台内部更新表头数据
					onMessage: (props, msg) => { //监听消息
						// 仅处理自己的按钮显示控制，重试和回退按钮有平台处理
						if (msg.error) {
							// 补充事务存在异常时，页面要显示的按钮控制逻辑
							// 由需求定义保留显示按钮逻辑
							// 单据追溯和刷新比较重要，需要显示
						} else {
							// 事务通过重试或回退方式成功时，要恢复按钮显示控制逻辑
						}
					},
					billtype: pageConfig.bill_type, //单据类型, 用于查询追溯
					billpkname: pageConfig.pkField, //单据主键名, 用于查询追溯
					dataSource: dataSource, //同步列表态缓存
				})}
			</div>
		);
	}
}

Card = createPage({
	billinfo: {
		billtype: 'card',
		pagecode,
		headcode: formId,
		bodycode: tableId
	},
	orderOfHotKey: [
		//适配快捷键（焦点定位在第一个可编辑字段及表单之间的快捷键适配）
		formId,
		tableId
	]
})(Card);

export default Card;

/*cI4u54VYZVPxnvGrX5EL6HXX6+tBhMNbry4zRW5Uf2RuXYfnoeOdBS4xA3fBBRYR*/